@import "tailwindcss";

html{
  font-size: 16px;
}

/* 自定义断点配置 */
@theme {
  --breakpoint-sm: 320px;
  --breakpoint-md: 480px;
  --breakpoint-lg: 1024px;
  --breakpoint-xl: 1312px;
  
  /* 头像颜色(混合色) */
  --color-avatar-1: linear-gradient(180deg, #FFA9D9 0%, #E83D3D 100%);
  --color-avatar-2: linear-gradient(180deg, #FFA7EB 0%, #F026A8 100%);
  --color-avatar-3: linear-gradient(180deg, #F5A8FF 0%, #BF23E5 100%);
  --color-avatar-4: linear-gradient(180deg, #DFA1FF 0%, #9A36F0 100%);
  --color-avatar-5: linear-gradient(180deg, #C9AAFF 0%, #6D3CF5 100%);
  --color-avatar-6: linear-gradient(180deg, #9EAAFF 0%, #3846F4 100%);
  --color-avatar-7: linear-gradient(180deg, #8CD8FF 0%, #2A6AF0 100%);
  --color-avatar-8: linear-gradient(180deg, #7BE7FF 2%, #1E85E2 100%);
  --color-avatar-9: linear-gradient(180deg, #92FDFF 0%, #14B2DD 100%);
  --color-avatar-10: linear-gradient(180deg, #89FED8 0%, #18C997 100%);
  --color-avatar-11: linear-gradient(180deg, #D7FFA7 0%, #5ED52A 100%);
  --color-avatar-12: linear-gradient(180deg, #FFED48 0%, #FD9E16 100%);
  --color-avatar-13: linear-gradient(180deg, #FFDC83 0%, #F88816 100%);
  --color-avatar-14: linear-gradient(180deg, #FFBA8D 1%, #EB6423 100%);
  
  /* 卡片阴影 */
  --shadow-shadow-1: 0 10px 35px rgba(0,0,0,0.25);
  --shadow-shadow-2: 0 10px 40px rgba(0,0,0,0.60);
  
  /* 文本颜色 */
  --color-textColor-1: oklch(70.5% 0.015 286.067);
  --color-textColor-2: oklch(87.1% 0.006 286.286);
}

@utility avatar-* {
  background-image: --value(--color-avatar-*);
}

@utility shadow-* {
  box-shadow: --value(--shadow-shadow-*);
}

@utility fontSize-* {
  font-size: --value(--fontSize-*);
}

/* 字体 */

/*  shimmer 动画实现光圈环绕效果 */
@property --shimmer-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
@keyframes shimmer {
  0% {
  --shimmer-angle:0deg;
  }
  100% {
  --shimmer-angle:360deg;
  }
}

/* 自定义动画 */
@keyframes bounce {
  0%, 100% {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }
  50% {
    transform: translateY(0);
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}

/* 搜索关键字的高光 */
.highlight{
  color:#facc15 ;
}


